<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/insurance.css">
</head>

<body>
    <header>
        <div class="header-top">
            <span class="wel"><a href=""><img src="./image/dyh_logo (1).png" alt=""></a></span>
            <ul class="headerList">
                <li>保险超市</li>
                <li>服务大厅</li>
                <li>投资者关系</li>
                <li>信息公开</li>
            </ul>
            <div class="headerSearch">
                <input type="text" placeholder="请输入您想搜索的内容">
            </div>
            <ul class="headerImg">
                <li><a href=""><img src="./image/dyh_icon_seach.png" alt=""></a></li>
                <li><a href=""><img src="./image/appErWei.png" alt=""></a></li>
                <li><a href=""><img src="./image/wode.png" alt=""></a></li>
                <li class="welPeople" ><a href="#">尊敬的泰康用户，您好</a></li>
        </div>
    </header>
    <section>
        <div class="container">
            <!-- 先把第一张图片显示出来 -->
            <img  class="on" src="./image/65416_1920x398.png" />
            <img src="./image/58353_1920x398.png" />
            <img src="./image/60662_1920x398.png" />
            <img src="./image/65656_1920x398.jpg" />
            <img src="./image/65794_1920x398.png" />
            <!-- 左右切换 -->
            <div class="left"><</div>
                    <div class="right">></div>
                    <!-- 焦点 -->
                    <ul>
                        <li class="active"></li>
                        <li></li>
                        <li></li>
                        <li></li>
                        <li></li>
                    </ul>
            </div>
            <div class="serveForu">
                <a href="#"><img src="./image/tj3Til (1).png" alt=""></a>
            </div>
            <div class="sectionMiddle">
                <div class="imagePeople">
                    <a href=""><img src="./image/qpwphoto.jpg" alt=""></a>
                </div>
                <div class="ele" id="ele">
                    <ul>
                        <li>健康保险</li>
                        <li>意外保险</li>
                        <li>企业保险</li>
                        <li>旅游险</li>
                        <li>家财险</li>
                    </ul>
                </div>
                <div class="container2" id="container2">
                    <div class="elec" style="display: block;">
                        <div class="elecImage"><a href="#"><img src="./image/1631677340551-1ertong.jpg" alt=""></a>
                        </div>
                        <div class="eled">
                            <h2>泰康儿童医疗保险E款</h2>
                            <p class="firstP"> <span style="color: #2a70f3;">>></span> 疾病、医疗、意外、疫苗保障</p>
                            <p class="secondP"><span style="color:#2a70f3;">>></span>专享家庭医生，重疾VIP服务</p>
                            <p class="bigP">￥44.2<span class="smallSpan">/起</span> </p>
                            <div class="knowMore"><a href="#">了解详情</a></div>
                        </div>
                        <div class="BtnHerf">
                            <a href="">更多好险，去严选</a>
                        </div>
                    </div>
                    <div class="elec" style="display: none;">
                        <div class="elecImage"><a href="#"><img src="./image/L2.jpg" alt=""></a></div>
                        <div class="eled">
                            <h2>泰康短期意外保险</h2>
                            <p class="firstP"> <span style="color: #2a70f3;">>></span> 国内短途旅游/出行投保</p>
                            <p class="secondP"><span style="color:#2a70f3;">>></span>高风险运动有保障</p>
                            <p class="bigP">￥2.1<span class="smallSpan">/起</span> </p>
                            <div class="knowMore"><a href="#">了解详情</a></div>
                        </div>
                        <div class="BtnHerf">
                            <a href="">更多好险，去严选</a>
                        </div>
                    </div>
                    <div class="elec" style="display: none;">
                        <div class="elecImage"><a href="#"><img src="./image/L3.jpg" alt=""></a></div>
                        <div class="eled">
                            <h2>雇主安心保</h2>
                            <p class="firstP"> <span style="color: #2a70f3;">>></span> 有效转移雇主用工风险</p>
                            <p class="secondP"><span style="color:#2a70f3;">>></span>工商保险也简单</p>
                            <p class="bigP">￥105<span class="smallSpan">/起</span> </p>
                            <div class="knowMore"><a href="#">了解详情</a></div>
                        </div>
                        <div class="BtnHerf">
                            <a href="">更多好险，去严选</a>
                        </div>
                    </div>
                    <div class="elec" style="display: none;">
                        <div class="elecImage"><a href="#"><img src="./image/L4.jpg" alt=""></a></div>
                        <div class="eled">
                            <h2>泰康旅游保险E款</h2>
                            <p class="firstP"> <span style="color: #2a70f3;">>></span> 享全国紧急救援服务</p>
                            <p class="secondP"><span style="color:#2a70f3;">>></span>最高50万意外伤害保险</p>
                            <p class="bigP">￥44.2<span class="smallSpan">/起</span> </p>
                            <div class="knowMore"><a href="#">了解详情</a></div>
                        </div>
                        <div class="BtnHerf">
                            <a href="">更多好险，去严选</a>
                        </div>
                    </div>
                    <div class="elec" style="display: none;">
                        <div class="elecImage"><a href="#"><img src="./image/L5.jpg" alt=""></a></div>
                        <div class="eled">
                            <h2>泰康家庭财产保险</h2>
                            <p class="firstP"> <span style="color: #2a70f3;">>></span>室内财产，房屋主体，装修均保障</p>
                            <p class="secondP"><span style="color:#2a70f3;">>></span>小投入，更安心</p>
                            <p class="bigP">￥30<span class="smallSpan">/起</span> </p>
                            <div class="knowMore"><a href="#">了解详情</a></div>
                        </div>
                        <div class="BtnHerf">
                            <a href="">更多好险，去严选</a>
                        </div>
                    </div>
                </div>

            </div>
            <div class="fixBox">
                <div class="fix1">
                    <a href="#"><img src="./image/fix1.png" alt=""></a>
                    <p>更多服务</p>
                </div>
                <div class="fix2">
                    <a href="#"><img src="./image/fix.png" alt=""></a>
                    <p>项目详情</p>
                </div>

                <div class="fix3">
                    <a href="#"><img src="./image/fix3.png" alt=""></a>
                    <p>联系我们</p>
                </div>

                <div class="fix4">
                    <a href="#"><img src="./image/fix4.png" alt=""></a>
                    <p>保险产品</p>
                </div>
            </div>
            <p class="titleP">保障规划 <span>Safeguards Planning </span> </p>
            <div class="sectionBottom">
                <div class="inputList">
                    <div class="select-item">
                        <div class="option-item">
                            <div class="label-Text">
                                <span>性别</span>
                            </div>

                        </div>
                        <select name="" id="">
                            <option value="">请您选择</option>
                            <option value="">男</option>
                            <option value="">女</option>
                        </select>
                    </div>
                    <div class="select-item">
                        <div class="option-item">
                            <div class="label-Text">
                                <span>年龄</span>
                            </div>

                        </div>
                        <select name="" id="">
                            <option value="">请您选择</option>
                            <option value="">18岁以下</option>
                            <option value="">18-30岁</option>
                            <option value="">30-70岁</option>
                            <option value="">70岁以上</option>
                        </select>
                    </div>
                    <div class="select-item">
                        <div class="option-item">
                            <div class="label-Text">
                                <span>婚姻</span>
                            </div>

                        </div>
                        <select name="" id="">
                            <option value="">请您选择</option>
                            <option value="">已婚</option>
                            <option value="">单身</option>
                            <option value="">离异</option>
                            <option value="">丧偶</option>
                        </select>
                    </div>
                    <div class="select-item">
                        <div class="option-item">
                            <div class="label-Text">
                                <span>职业</span>
                            </div>

                        </div>
                        <select name="" id="">
                            <option value="">请您选择</option>
                            <option value="">职员</option>
                            <option value="">企业主</option>
                            <option value="">自由职业</option>
                        </select>
                    </div>
                    <div class="select-item">
                        <div class="option-item">
                            <div class="label-Text">
                                <span>希望保障</span>
                            </div>

                        </div>
                        <select name="" id="">
                            <option value="">请您选择</option>
                            <option value="">不限</option>
                            <option value="">自己</option>
                            <option value="">老人</option>
                            <option value="">孩子</option>
                            <option value="">伴侣</option>
                        </select>
                        
                    </div>
                    <div class="select-item">
                        <div class="option-item">
                            <div class="label-Text">
                                <span>保障类型</span>
                            </div>

                        </div>
                        <select name="" id="">
                            <option value="">请您选择</option>
                            <option value="">企业财产</option>
                            <option value="">个人财产</option>
                            <option value="">宠物医疗</option>
                            <option value="">职场</option>
                        </select>
                    </div>
                    <button>量身推荐 去规划>></button>
                </div>
                <div class="img2">
                    <img src="./image/qpw2.jpg" alt="">
                </div>
            </div>
    </section>
    <footer>
        <div class="footerTop">
            <div class="footerList">
                <ul>
                    <li class="firstLi">帮助中心</li>
                    <li><a href="">保单续保</a></li>
                    <li><a href="">理赔服务</a></li>
                    <li><a href="">资料下载</a></li>
                    <li><a href="">常见问题</a></li>
                    <li><a href="">隐私政策</a></li>
                </ul>
                <ul>
                    <li class="firstLi">关于平安</li>
                    <li><a href="">品牌故事</a></li>
                    <li><a href="">门店网店</a></li>
                    <li><a href="">偿付能力信息披露</a></li>
                    <li><a href="">消费者保护监管评价</a></li>
                    <li><a href="">公开信息披露</a></li>
                    <li><a href="">互联网保险信息披露</a></li>
                </ul>
                <ul>
                    <li class="firstLi">站外app</li>
                    <li><a href="">平安好车主</a></li>
                </ul>
              </div>
              <div class="codeList">
                <ul>
                    <li><img src="./image/foot_ewm01.jpg" alt=""></li>
                    <li>泰康保险好生活工作号</li>
                </ul>
                <ul>
                    <li><img src="./image/foot_ewm01.jpg" alt=""></li>
                    <li>泰康保险好生活App</li>
                </ul>
              </div>
              <div class="phoneList">
                <ul>
                    <li>官方客服：<span style="color:#2a70f3;">40088-95512转2</span> </li>
                    <li>官方客服：<span style="color:#2a70f3;">40088-95512转3</span></li>
                </ul>
              </div>
        </div>

    </footer>
    <script>

    </script>
</body>

</html>